import {designPage} from "@peryl/react-compose";
import {$file, Button, PageCard, PageCardContent, PageCardTitle} from "plain-design";
import {microApp} from "../../microApp";

export default designPage(() => {

  const parse = async () => {
    const file = await $file.chooseFile({ accept: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' });
    console.log({ file });

    const JSZip = await microApp.resource.load('JSZip', window);

    const reader = new FileReader();
    reader.onload = async (e: any) => {
      const arrayBuffer = e.target.result;
      const zip = new JSZip();
      const loadedZip = await zip.loadAsync(arrayBuffer);

      loadedZip.forEach((relativePath: string, zipEntry: any) => {
        console.log(relativePath, zipEntry);
      });
    };
    reader.readAsArrayBuffer(file as any);
  };

  return () => (
    <PageCard>
      <PageCardTitle title="PPT Parser"/>
      <PageCardContent>
        <Button onClick={parse} label="选择PPTX"/>
      </PageCardContent>
    </PageCard>
  );
});

/*@formatter:off*/
interface iVerse {/*节标题*/title: string,/*段落内容*/paragraph: string[],}
interface iChapter {/*章标题*/title: string;verses: iVerse[],}
interface iResponseType {/*大纲标题*/title: string;chapters: iChapter[];}
/*@formatter:on*/

const userContent = "AI大模型课程";

const prompt = `
帮我根据用户需求生成一份大纲数据，返回的数据格式为json，json的数据结构可以参考这段typescript代码中的iResponseType，

\`\`\`ts
interface iVerse {/*段落标题*/title: string,/*段落内容*/paragraph: string[],}
interface iChapter {/*章标题*/title: string;verses: iVerse[],}
interface iResponseType {/*大纲标题*/title: string;chapters: iChapter[];}
\`\`\`

用户的要求为：${userContent}
`;

